<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>条件渲染</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
</head>
<body>
    <div id="main">
      <div v-if="result>=90">优秀</div>
      <div v-else-if="result>=70">良好</div>
      <div v-else-if="result>=60">及格</div>
      <div v-else="result<60">不及格</div>
      <div v-if="str.indexOf('vue')>-1">有vue字符</div>
      <div v-if="arr.length>0">{{arr}}</div>
    </div>
</body>
<script>
    //jquery $.get ,$.post  ajax 元素去写？？？？？
    let vue = new Vue({
        el:"#main",
        data:{
            result:50,//实现这个逻辑 ------大于90 算优秀 ，大于 70 算良好 ，大于等于 60 及格 小于 60 重修下吧 
            str:'xuevu',//要判断str 中是否存在 vue 字符？？？,
            arr:[1,2,4],//数组是否为空 0 是否有数字？在js中可以指定下标
        }
    });
    //原生js的写法
    // let score=Math.round(Math.random()*100);
    // if(score>90){
    //     '优秀'
    // } else if(score>70){
    //     '良好'
    // } else if (score>=60){
    //     '及格'
    // } else{
    //     '不及格'
    // }
    // str='xuevue';
    // str.indexOf("vue")>-1
    let arr=[1,2,3]
    console.log(arr.length);

</script>
</html>